<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="../manager/base.jsp"%>
<script type="text/javascript" src="${ctx}/layui/layui.all.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx}/layui/css/layui.css">
<script type="text/javascript" src="${ctx}/js/layui_common.js"></script>
<!-- 上传图片所需要的css,js -->
<link href="${ctx}/css/uploadcss/iconfont.css" rel="stylesheet"
	type="text/css" />
<link href="${ctx}/css/uploadcss/fileUpload.css" rel="stylesheet"
	type="text/css">
<script type="text/javascript" src="${ctx}/js/uploadjs/fileUpload.js"></script>
<!-- end 上传图片所需要的css,js -->
<script type="text/javascript">
$(function() {
	//自适应屏幕宽度
	var main_h = $(window).height();
	$('.hy_list').css('height', main_h - 45 + 'px');

	var main_w = $(window).width();
	$('.xjhy').css('width', main_w - 40 + 'px');

	$(".tabBox .tabCont:first").css("display", "block");
	$(".tabBox .tabNav li").click(
			function() {
				$(this).siblings("li").removeClass("now");
				$(this).addClass("now");
				$(this).parents(".tabBox").find(".tabCont").css("display",
						"none");
				var i = $(this).index();
				$(this).parents(".tabBox").find(".tabCont:eq(" + i + ")")
						.css("display", "block");
			});

	$('.xial_m span').click(function() {
		$(this).parent('.xial_m').siblings('.xl_ctn').toggle();
	});
});
<!--框架高度设置-->
</script>
<script type="text/javascript">
$(function() {
	getBasicsDataByName('', '');
});

function getBasicsDataInfo() {
	var name = $("input[name='name']").val();
	getBasicsDataByName(name);
}

function getBasicsDataByName(name) {
	var i;
	$.ajax({
				url : '${ctx}/basicsData/getBasicsDataByParam',
				data : {
					"name" : name
				},
				type : 'get',
				dataType : 'json',
				beforeSend : function() {
					i = layer.open({
						type : 3,
						area : '500px',
						skin : 'layui-layer-molv',
						shade : 0.5,
						shadeClose : true,
						maxmin : true
					});
				},
				success : function(data) {
					layer.close(i);
					$("#deviceInfo").html("");
					if (data != null) {
						$
								.each(
										data,
										function(index, item) {
											var html = "";
											html += "<tr>";
											html += "<td>" + item.name
													+ "</td>";
											if (item.img == "") {
												html += "<td>" + item.img
														+ "</td>";
											} else {
												html += "<td><img src=\""+item.img+"\" style=\"width:20px;height:20px;\"/></td>";
											}
											html += "<td>";
											html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"updateBasicsData('"
													+ item.uuid
													+ "')\">修改</a>";
											html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"deleteBasicsData('"
													+ item.uuid
													+ "')\">删除</a>";
											html += "</td>";
											html += "</tr>";
											$("#deviceInfo").append(html);
										});
					}
					//添加分页
					//计算总数
					var total = 0;
					if (data == null) {
						total = 0;
					} else if (data.length == 0 || data[0].cnt == null
							|| data[0].cnt == ""
							|| data[0].cnt == undefined) {
						total = 0;
					} else {
						total = data[0].cnt;
					}
					//定义一个laypage实例
					var laypage = layui.laypage;
					laypage
							.render({
								elem : 'r_foot_m', //注意，这里的 test1 是 ID，不用加 # 号
								count : total,
								prev : '上一页',
								next : '下一页',
								cont : 'claimpage',
								skin : 'yahei',
								jump : function(obj, first) {
									if (first != true) {//是否首次进入页面
										var currentPage = obj.curr;//获取点击的页码
										//通过当前页数，获取对应的数据
										$.ajax({
													url : '${ctx}/basicsData/getBasicsDataByParam',
													data : {
														"name" : name,
														"page" : currentPage
													},
													type : 'get',
													dataType : 'json',
													beforeSend : function() {
														i = layer
																.open({
																	type : 3,
																	area : '500px',
																	skin : 'layui-layer-molv',
																	shade : 0.5,
																	shadeClose : true,
																	maxmin : true
																});
													},
													success : function(data) {
														layer.close(i);
														$("#deviceInfo").html("");
														if (data != null) {
															$
																	.each(
																			data,
																			function(
																					index,
																					item) {
																				var html = "";
																				html += "<tr>";
																				html += "<td>"
																						+ item.name
																						+ "</td>";
																				if (item.img == ""
																						|| item.img == null) {
																					html += "<td>"
																							+ item.img
																							+ "</td>";
																				} else {
																					html += "<td><img src=\""+item.img+"\" style=\"width:20px;height:20px;\"/></td>";
																				}
																				html += "<td>";
																				html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"updateBasicsData('"
																						+ item.uuid
																						+ "')\">修改</a>";
																				html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"deleteBasicsData('"
																						+ item.uuid
																						+ "')\">删除</a>";
																				html += "</td>";
																				html += "</tr>";
																				$(
																						"#deviceInfo")
																						.append(
																								html);
																			});
														}
													}
												});
									}
								}
							});
				}
			});
}
</script>
<script type="text/javascript">
//打开弹框
var index;
function updateBasicsData(uuid) {
	//通过id查询角色信息
	$.ajax({
				url : '${ctx}/basicsData/getBasicsDataByParam',
				data : {
					"uuid" : uuid
				},
				type : 'get',
				dataType : 'json',
				async : false,
				success : function(data) {
					//添加下拉内容
					$.each(
									data,
									function(index, item) {
										if (data != null) {
											var html = "";
											html += '<div class="tabCont">';
											html += '<input type="hidden" id="updateuuid" value="'+item.uuid+'"/>';
											html += '<ul class="hypz">';
											html += '	<li class="clearfix"><span class="title">设备名称：</span>';
											html += '		<div class="li_r">';
											html += '			<input class="chang" name="updatename" type="text" value="'+item.name+'"> <i>*</i> ';
											html += '		</div></li>';
											html += '	<li class="clearfix" style="height:330px;"><span class="title">设备图片：</span>';
											html += '		<div class="li_r">';
											if (item.img != null
													&& item.img != '') {
												html += '			<img src="'+item.img+'" style="width:50px;height:50px;"/>';//http://47.92.35.232/bg_img/btn2.png
											} else {
												html += '			<img src="" style="width:50px;height:50px;"/>';
											}
											html += '			<div id="update_fileUploadContent" class="fileUploadContent"></div>';
											html += '		</div>';
											html += '	</li>';

											html += '	<li class="tj_btn"><a href="javascript:void(0);" onclick="updateBasicsDataInfo();">修改</a></li>';
											html += '</ul>';
											html += '</div>';
											html += '<script>';
											html += '	$("#update_fileUploadContent").initUpload({';
											html += '		"maxFileNumber":1,';
											html += '		"beforeUpload": beforeUpdateUploadFun,';
											html += '		"fileType": [\'png\', \'jpg\', \'jpeg\',\'gif\']';
											html += '	});';
											html += '	function beforeUpdateUploadFun(opt) {';
											html += '		opt.otherData = [{';
											html += '			"name": "name",';
											html += '			"value": "zxm"';
											html += '		}];';
											html += '	}';
											html += '<\/script>';

											//打开弹框，显示
											index = layer
													.open({
														type : 1,
														title : '修改设备信息',
														area : [ '600px',
																'500px' ],
														shadeClose : true, //点击遮罩关闭
														content : html
													});
										}
									});
				}
			});
}

function updateBasicsDataInfo() {
	var i;
	var uuid = $("#updateuuid").val();
	var name = $("input[name='updatename']").val();
	if (name == null || name == "" || name == undefined) {
		//提示不能为空
		layer.alert("设备名称不能为空!");
		return;
	}
	var form = new FormData();
	form.append('uuid', uuid);
	form.append('name', name);
	var opt = uploadTools.getOpt("update_fileUploadContent");
	var fileList = uploadFileList.getFileList(opt);
	var fileNumber = uploadTools.getFileNumber(opt);
	if (fileNumber > 0) {
		form.append("imgfiles", fileList[0]);
	}
	$.ajax({
		url : '${ctx}/basicsData/updateBasicsDataInfo',
		data : form,
		type : 'post',
		processData : false,
		contentType : false,
		cache : false,
		dataType : 'html',
		beforeSend : function() {
			i = layer.open({
				type : 3,
				area : '500px',
				skin : 'layui-layer-molv',
				shade : 0.5,
				shadeClose : true,
				maxmin : true
			});
		},
		success : function(data) {
			layer.close(i);
			if (data == "success") {
				layer.alert("修改成功!", function() {
					window.location.reload();
					parent.layer.close(index);
				});
			}
		}
	});
}
</script>
<script type="text/javascript">
//删除大学信息
function deleteBasicsData(uuid) {
	layer.confirm('确定要删除这条记录吗?', {
		icon : 3,
		title : '提示'
	}, function(index) {
		$.ajax({
			url : '${ctx}/basicsData/deleteBasicsData',
			data : {
				"uuid" : uuid
			},
			type : 'post',
			dataType : 'html',
			success : function(data) {
				if (data == "success") {
					layer.alert("删除成功!", function() {
						window.location.reload();
						parent.layer.close(index);
					});
				} else if (data == "nopass") {
					layer.alert("没有权限添加,请联系管理员!");
				} else if (data == "error") {
					layer.alert("删除异常,请联系管理员!");
				}
			}
		});
	});
}
</script>
<script type="text/javascript">
function addBasicsData() {
	var i;
	var name = $("input[name='device_name']").val();
	if (name == null || name == "" || name == undefined) {
		//提示不能为空
		layer.alert("设备名称不能为空!");
		return;
	}
	var form = new FormData();
	form.append('name', name);
	var opt = uploadTools.getOpt("fileUploadContent");
	//查看文件是否存在
	var fileList = uploadFileList.getFileList(opt);
	var fileNumber = uploadTools.getFileNumber(opt);
	if (fileNumber > 0) {
		form.append("imgfiles", fileList[0]);
	}

	$.ajax({
		url : '${ctx}/basicsData/addBasicsData',
		data : form,
		type : 'post',
		processData : false,
		contentType : false,
		cache : false,
		dataType : 'html',
		beforeSend : function() {
			i = layer.open({
				type : 3,
				area : '500px',
				skin : 'layui-layer-molv',
				shade : 0.5,
				shadeClose : true,
				maxmin : true
			});
		},
		success : function(data) {
			layer.close(i);
			if (data == "success") {
				layer.alert("添加成功!", function() {
					window.location.reload();
					parent.layer.close(index);
				});
				$("input[name='name']").val("");
			} else if (data == "nopass") {
				layer.alert("没有权限添加,请联系管理员!");
			} else if (data == "error") {
				layer.alert("添加异常,请联系管理员!");
			}
		}
	});
}
</script>
<div id="right_ctn">
	<div class="right_m">
		<!--列表-->
	<div class="hy_list">
		<div class="box_t">
			<span class="name">基础数据列表</span>
			<!--当前位置-->
			<div class="position">
				<a href=""><img src="${ctx}/images/icon5.png" alt="" /></a> <a
					href="">首页</a> <span><img src="${ctx}/images/icon3.png"
					alt="" /></span> <a href="">设备管理</a> <span><img
					src="${ctx}/images/icon3.png" alt="" /></span> <a href="">基础数据列表</a>
			</div>
			<!--当前位置-->
		</div>

		<!--新建-->
		<form action="" method="post">
			<div class="xjhy" style="padding: 0px;">
				<div class="tabBox_t">
					<div class="tabBox">
						<ul class="tabNav">
							<li class="now"><span>数据查询</span></li>
							<li><span>添加数据</span></li>
						</ul>
						<div class="tabCont" style="display: block;">
							<!--所有学校-->
							<ul class="hypz gjpz clearfix">
								<!--查询-->
								<div class="search">
									<span>按设备名称查询：</span>
									<div class="s_text">
										<input name="name" type="text">
									</div>
									<a href="javascript:void(0);" class="btn"
										onclick="getBasicsDataInfo()">查询</a>
								</div>
								<!--查询-->
								<div class="space_hx">&nbsp;</div>
								<!--列表-->
								<form action="" method="post">
									<table cellpadding="0" cellspacing="0" class="list_hy"
										style="width: 98%;">
										<tr>
											<th scope="col">设备名称</th>
											<th scope="col">设备图片</th>
											<th scope="col">操作</th>
										</tr>
										<tbody id="deviceInfo">
										</tbody>
									</table>
									<!--列表-->
									<!--右边底部-->
									<div class="r_foot">
										<div class="r_foot_m" id="r_foot_m"></div>
									</div>
								</form>
								<!--右边底部-->
							</ul>
							<!--所有权限-->
						</div>
						<div class="tabCont" style="">
							<!--添加权限-->
							<ul class="hypz">
								<li class="clearfix"><span class="title">设备名称：</span>
									<div class="li_r">
										<input class="chang" name="device_name" type="text"> <i>*</i>
									</div></li>
								<li class="clearfix" style="height: 280px;"><span
									class="title">图片上传：</span>
									<div class="li_r">
										<div id="fileUploadContent" class="fileUploadContent"></div>
									</div></li>
								<li class="tj_btn"><a href="javascript:void(0);"
									onclick="addBasicsData();">添加</a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>
	<!--列表-->
	</div>
</div>
<script type="text/javascript">
$("#fileUploadContent").initUpload({
	//"uploadUrl": "#", //上传文件信息地址
	//"size":350,//文件大小限制，单位kb,默认不限制
	"maxFileNumber" : 1,//文件个数限制，为整数
	//"filelSavePath":"",//文件上传地址，后台设置的根目录
	"beforeUpload" : beforeUploadFun, //在上传前执行的函数
	//"onUpload":onUploadFun，//在上传后执行的函数
	//autoCommit:true,//文件是否自动上传
	"fileType" : [ 'png', 'jpg', 'jpeg', 'gif' ]
//文件类型限制，默认不限制，注意写的是文件后缀
});
function beforeUploadFun(opt) {
	opt.otherData = [ {
		"name" : "name",
		"value" : "zxm"
	} ];
}
</script>